import React ,{useState,useRef,useEffect}from 'react';
import {Form,message } from 'antd';
import request from "../../../../assets/js/pc/utils/request";
function hoc(WithComponent){
    return function useHoc(props){
        const [form] = Form.useForm();
        const [verification,setVerification] = useState('发送验证码');
        const [isRun,setIsRun] = useState(true);
        const [isLoading,setIsLoading] = useState(false);
        const [isDisabled,setIsDisabled] = useState(false);
        const [isDisabledVerification,setIsDisabledVerification] = useState(true)

        let  timer = useRef(null);

        //注册
        const onFinish = (values)=> {
            setIsLoading(true);
            setIsDisabled(true);
            let url = `${window.base.config.baseUrlShop}home/user/reg?token=${window.base.config.token}`;
            let data = {
                cellphone:values.mobile,
                vcode:values.smsCode,
                password:values.password
            }
            request(url,'post',data).then((res)=>{
                if (res.code===200){
                    message.success({
                        content: '注册成功',
                        style: {
                            marginTop: '50vh',
                        },
                    }).then(() => {
                        setIsLoading(false);
                        setIsDisabled(false);
                        setIsDisabledVerification(true);
                        setVerification('发送验证码');
                        clearInterval( timer.current);
                        form.resetFields();
                        props.history.replace('login')
                    })
                }else {
                    message.error({
                        content: res.data,
                        style: {
                            marginTop: '50vh',
                        },
                    }).then(() => {
                        setIsLoading(false);
                        setIsDisabled(false);
                        setIsDisabledVerification(true);
                        setVerification('发送验证码');
                        clearInterval( timer.current);
                    })
                }
            })
        };
        //发送验证码
        const sentVerificationCode = async ()=>{
            try {
                await form.validateFields(['mobile']);
                let number = 10;
                if (isRun){
                    setIsDisabledVerification(true)
                    setVerification('重新发送('+number+')s');
                    timer.current = setInterval(()=>{
                        setIsRun(false);
                        if (number>0){
                            number--;
                            setVerification('重新发送('+number+')s')
                        }else {
                            clearInterval( timer.current)
                            setIsRun(true);
                            setIsDisabledVerification(false)
                            setVerification('发送验证码')
                        }
                    },1000);
                }
            } catch (errorInfo) {}
        }

        //自定义验证
       const handleCheckPwd =  (v,rule, value)=>{
           setIsDisabled(false);
            switch (v){
                case 'mobile':
                    try {
                        let reg = /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/;
                        if (value&&!reg.test(value)) {//验证手机号是否正确
                             return Promise.reject("请输入正确的手机号");
                        }else {//验证手机号是否注册
                            let url = `${window.base.config.baseUrlShop}home/user/isreg?token=${window.base.config.token}`;
                            let data ={
                                username:value
                            }
                             return request(url,'post',data).then((res)=>{
                                if (res.data.isreg==='1'){
                                    return  Promise.reject("手机号已注册");
                                }else {
                                    setIsDisabledVerification(false);
                                }
                            })
                        };
                    } catch (errorInfo) {}
                    break;
                default:
                    break;
            }

       }
        //跳转页面
       const goPage = (url)=>{
           clearInterval(timer.current)
            props.history.replace(url)
        }
        useEffect(()=>{

            return (
                clearInterval(timer.current)
            )
        },[]);
        let newProps = {
            isLoading:isLoading,
            isDisabled:isDisabled,
            isDisabledVerification:isDisabledVerification,
            goPage:goPage.bind(this),
            onFinish:onFinish.bind(this),
            handleCheckPwd:handleCheckPwd.bind(this),
            sentVerificationCode:sentVerificationCode.bind(this),
            verification:verification,
            form:form
        }
        return <WithComponent {...props} {...newProps} />
    }
}
export default hoc;
